import React from 'react'
import { useEffect } from 'react'
import FilterWarrper from './entire-filter/index'
import PaginationWarrper from './entire-pagination/index'
import RoomsWarrper from './entire-rooms/index'
import EntireWarrper from './style'
import { useDispatch, useSelector } from 'react-redux'
import { memo } from 'react'
import { getEntireInfo } from '@/store/modules/entireSlice'


const index = memo((props) => {
  const dispatch = useDispatch()
  useEffect(()=>{
    dispatch(getEntireInfo({offset:0,size:20}));
  },[dispatch])
  const {entire} = useSelector((state)=>({
    entire:state?.entire?.entireInfo
  }))
  useEffect(()=>{
    // window.scrollTo(0)
    document.documentElement.scrollTop = 0
  },[entire])
  return (
    <EntireWarrper>
    <FilterWarrper></FilterWarrper>
    <RoomsWarrper listData={entire?.list}></RoomsWarrper>
    <PaginationWarrper></PaginationWarrper>
  </EntireWarrper>
  )
})

export default index